<template>
	<view>
		<view class="content" style="align-items: center;margin-bottom: 8%;">
		     <view class="uni-flex uni-row" style="padding-left: 38%;">
		      <view style="margin-top: 10%;" class="uni-center text" :class="usertype == '0' ? 'active' : 'unactive'" id="0" @click="changeuser">已审批</view>
		      <view style="margin-top: 10%;margin-left: 10%;" class="uni-center text" :class="usertype == '1' ? 'active' : 'unactive'" id="1" @click="changeuser">未审批</view>
		     </view>
		</view>
		<view v-if="getfinish&&getfinish1" v-for="(item,index) in activity_num">
			<view v-if="usertype == '0' && srclocation1.length > index" >
				 <button type="default" @click="information(index)">
				<view class="uni-flex uni-row" style=" width: auto;margin: 10px;background:white;">
					<view class="uni-column" style="width: 50%;">
						<image :src = "httpurl+srclocation1[index]" mode="aspectFill" style="height: 300rpx;width:300rpx;padding:5px;border-radius: 25px;">
							
						</image>
					</view>
					<view class="uni-flex uni-column"  >
						<text style="margin: 2%; font-size: 35rpx;font-weight: 600;">{{name1[index]}}</text>
						<text style="color:darkgray;font-size: 15px;margin: 2%;">{{start_time1[index]}} 至 {{end_time1[index]}}</text>
						<view class="uni-flex uni-row">
							<text style="margin-top: 5%; display: flex;flex-direction: column;align-items: center;">{{type1[index]}}</text>
							<image :src="state[index]" style="margin: 4%;height: 50rpx;width: 50rpx;"></image>
						</view>
					</view>
				</view>
				</button>
			</view>
			<view v-if="usertype == '1' && srclocation2.length > index">
				 <button type="default" @click="information(index)">
				<view class="uni-flex uni-row" style=" width: auto;margin: 10px;background:white;">
					<view class="uni-column" style="width: 50%;">
						<image :src ="httpurl+srclocation2[index]"style="height: 300rpx;width:300rpx;padding:5px;border-radius: 25px;">
							
						</image>
					</view>
					<view class="uni-flex uni-column"  >
						<view style="margin: 2%; font-size: 35rpx;font-weight: 600;">{{name2[index]}}</view>
						<view style="color:darkgray;font-size: 15px;margin: 2%;">{{start_time2[index]}} 至 {{end_time2[index]}}</view>
						<view class="uni-flex uni-row">
							<text style="margin-top: 5%; display: flex;flex-direction: column;align-items: center;" >{{type1[index]}}</text>
							<!-- <image :src="state[index]" style="margin: 4%;height: 50rpx;width: 50rpx;"></image> -->
						</view>
					</view>
				</view>
               </button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				usertype:'0',
				httpurl: getApp().globalData.weburl, //app.vue中定义的全局变量，后端ip地址
			    srclocation1:[],                   //图片
				srclocation2:[],
			    name1:[],
				name2:[],
				start_time1:[],
				start_time2:[],
				end_time1:[],
				end_time2:[],
				type1:[],
				type2:[],
				state_model:["../../../static/icon/tab/通过.png","../../../static/icon/tab/不通过.png"],
				state:[],
				httpurl: getApp().globalData.weburl, //app.vue中定义的全局变量，后端ip地址,
				type_name:["文体活动","艺术活动","心理活动","体育活动","IT技能","摄影技能","英语活动","郊游活动"],
				Activity_informatin:[],
				activity_num:0,
				activity_num1:0,
				activity_num2:0,
				getfinish:false,
				getfinish1:false
				
			}
		},
		onLoad:function(option){
			console.log(option);
			
		},
		created() {
			this.approvedActivity();
			this.ActivityApply();
		},
		onPullDownRefresh() {
			console.log('下拉刷新');
			this.approvedActivity();
			this.ActivityApply();
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 500);
		},
		methods: {
			changeuser(e){
			    console.log("切换选择内容为："+e.currentTarget.id);
			    if(e.currentTarget.id=='0'){
					this.activity_num=this.activity_num1;
				}
				else{
					this.activity_num=this.activity_num2;
				}
				this.usertype=e.currentTarget.id;
			   },
			   information(index){
				   console.log(index);
				   var mes=JSON.stringify(this.Activity_informatin[index]);
				   uni.navigateTo({
				   	url:'../activity_message/activity_message?activity_information='+mes
				   });
			   },
			   approvedActivity(){
			    var that=this;
			    uni.request({
			        url: that.httpurl+'getapprovedActivity/', //服务器地址+接口名
			        data: {
			      W_id:getApp().globalData.userid
			        },
			     method: 'POST',
			        header: { 
			      'X-Requested-With': 'XMLHttpRequest',
			      "Accept": "application/json",
			      "Content-Type": "application/json; charset=UTF-8"
			     },
			     dataType: 'json',
			        success: (res) => {
			      console.log("request success");
						console.log(res.data);
						var Activity_message=[];
						Activity_message=res.data.activity_message;
						that.activity_num1 = Activity_message.length;
						console.log(Activity_message)
						that.Activity_informatin=Activity_message;
						console.log(that.Activity_informatin);
						for(var i=0;i<Activity_message.length;i++){
							that.name1.push(Activity_message[i].a_name);
							that.start_time1.push(Activity_message[i].a_start_time);
							that.end_time1.push(Activity_message[i].a_end_time);
							var index=Activity_message[i].type_id;
							that.type1.push(that.type_name[index-1]);
							that.srclocation1.push(Activity_message[i].a_cover);
							if(Activity_message[i].is_pass==1){
								that.state.push(that.state_model[0]);
							}
							if(Activity_message[i].is_pass==2){
								that.state.push(that.state_model[1]);
							}
						}
						that.activity_num=that.activity_num1;
						that.getfinish1=true;
						
			        },
			     fail: (res) => {
			      console.log("request fail");
			        },
			    });
			   },
			   ActivityApply(){
			    var that=this;
			    uni.request({
			        url: that.httpurl+'getactivityApply/', //服务器地址+接口名
			        data: {
			      W_id:getApp().globalData.userid
			        },
			     method: 'POST',
			        header: { 
			      'X-Requested-With': 'XMLHttpRequest',
			      "Accept": "application/json",
			      "Content-Type": "application/json; charset=UTF-8"
			     },
			     dataType: 'json',
			        success: (res) => {
			      console.log("request success");
				  console.log(res.data);
						var Activity_message=[];
						Activity_message=res.data.activity_message;
						that.activity_num2=Activity_message.length;
						for(var i=0;i<Activity_message.length;i++){
							that.name2.push(Activity_message[i].a_name);
							that.start_time2.push(Activity_message[i].a_start_time);
							that.end_time2.push(Activity_message[i].a_end_time);
							var index=Activity_message[i].type_id;
							that.type1.push(that.type_name[index-1]);
							that.srclocation2.push(Activity_message[i].a_cover);
						}
						that.getfinish=true;
			        },
			     fail: (res) => {
			      console.log("request fail");
			        },
			    });
			   },
		}
	}
</script>

<style>
 .active
 {
  border-bottom:2px solid #528FFF;
  color:#528FFF;
  font-weight: 450;
}

.content
{
  width:90%;
  height: auto;
}
.type1{
border-radius: 10px;
background: #00acf5;
color: #2700ec;
width: 80px;
height: 20px;

}


</style>
